<template>
	<div class="block">
		<span class="demonstration"></span>
		<el-carousel height="400px" >
			
			<el-carousel-item>
				<img src="../assets/aaa.jpg" class="image">
			</el-carousel-item>
			<el-carousel-item>
				<img src="../assets/bbbb.png" class="image">
			</el-carousel-item>
			<el-carousel-item>
				<img src="../assets/cc.jpg" class="image">
			</el-carousel-item>
			<el-carousel-item>
				<img src="../assets/dd.jpg" class="image">
			</el-carousel-item>
			</el-carousel>
			<div class="f">
			<el-button>默认按钮</el-button>
			<el-button type="primary">主要按钮</el-button>
			<el-button type="success">成功按钮</el-button>
			<el-button type="info">信息按钮</el-button>
			</div>
<!-- 			<el-button type="warning">警告按钮</el-button>
			<el-button type="danger">危险按钮</el-button> -->
		</div>
		
</template>

<script>
	export default {
	name: 'pic',
	props: {
	counter: String
	}
	}
</script>

<style scoped>
	.f{
		width: 900px; 
		margin-left: 500px;
		height: 100px;
	}
	.el-carousel{
		padding-top: 50px;
		width: 900px; 
		margin-left: 500px;
	}
	.block{
	
	margin-top: 100px;
	width: 100%;
	background-image: url(../assets/59a3d65eNd604759b.png)
	}
/* 	#pic{
		width: 800px;
		height: 400px;
		background-color: #42B983;
		margin: auto;
	} */
	.el-carousel__item h3 {

		color: #475669;
		font-size: 10px;
		opacity: 0.75;
		line-height: 150px;
		margin: 0;
	}

	/* .el-carousel__item:nth-child(2n) {
		background-color: #99a9bf;
	}
	
	.el-carousel__item:nth-child(2n+1) {
		
		background-color: #d3dce6;
	} */
/* 	img{
		width:100%
	} */
	
</style>
